<template>
  <div>
    <div class="node-wrap" v-if="nodeConfig.type!=4">
      <div class="node-wrap-box"
           :class="(nodeConfig.type==0?'start-node ':'')+(isTried&&nodeConfig.error?'active error':'')">
        <div>
          <div class="title"
               :style="'background: rgb('+ ['87, 106, 149','255, 148, 62','50, 150, 250'][nodeConfig.type] +');'">
            <span class="iconfont" v-show="nodeConfig.type==1"></span>
            <span class="iconfont" v-show="nodeConfig.type==2"></span>
            <span v-if="nodeConfig.type==0">{{nodeConfig.nodeName}}</span>
            <input type="text" class="ant-input editable-title-input" v-if="nodeConfig.type!=0&&isInput"
                   @blur="blurEvent()" @focus="$event.currentTarget.select()" v-focus
                   v-model="nodeConfig.nodeName" :placeholder="placeholderList[nodeConfig.type]">
            <span class="editable-title" @click="clickEvent()" v-if="nodeConfig.type!=0&&!isInput">{{nodeConfig.nodeName}}</span>
            <i class="anticon anticon-close close" v-if="nodeConfig.type!=0" @click="delNode()"></i>
          </div>
          <div class="content" @click="setPerson">
            <div class="text" v-if="nodeConfig.type==0">{{arrToStr(flowPermission)?arrToStr(flowPermission):'所有人'}}
            </div>
            <div class="text" v-if="nodeConfig.type==1">
              <!--              用户节点-->
              <span class="placeholder"
                    v-if="!setApproverStr(nodeConfig)">请选择{{placeholderList[nodeConfig.type]}}</span>
              {{setApproverStr(nodeConfig)}}
            </div>
            <div class="text" v-if="nodeConfig.type==2">
              <!--              抄送人-->
              <span class="placeholder" v-if="!copyerStr(nodeConfig)">请选择{{placeholderList[nodeConfig.type]}}</span>
              {{copyerStr(nodeConfig)}}
            </div>
            <i class="anticon anticon-right arrow"></i>
          </div>
          <div class="error_tip" v-if="isTried&&nodeConfig.error">
            <i class="anticon anticon-exclamation-circle" style="color: rgb(242, 86, 67);"></i>
          </div>
        </div>
      </div>
      <addNode :childNodeP.sync="nodeConfig.childNode"></addNode>
    </div>
    <div class="branch-wrap" v-if="nodeConfig.type==4">
      <div class="branch-box-wrap">
        <div class="branch-box">
          <button class="add-branch" @click="addTerm">添加条件</button>
          <div class="col-box" v-for="(item,index) in nodeConfig.conditionNodes" :key="index">
            <div class="condition-node">
              <div class="condition-node-box">
                <div class="auto-judge" :class="isTried&&item.error?'error active':''">
                  <div class="sort-left" v-if="index!=0" @click="arrTransfer(index,-1)">&lt;</div>
                  <div class="title-wrapper">
                    <input type="text" class="ant-input editable-title-input" v-if="isInputList[index]"
                           @blur="blurEvent(index)" @focus="$event.currentTarget.select()" v-focus
                           v-model="item.nodeName">
                    <span class="editable-title" @click="clickEvent(index)"
                          v-if="!isInputList[index]">{{item.nodeName}}</span>
                    <span class="priority-title" @click="setPerson(item.priorityLevel)">优先级{{item.priorityLevel}}</span>
                    <i class="anticon anticon-close close" @click="delTerm(index)"></i>
                  </div>
                  <div class="sort-right" v-if="index!=nodeConfig.conditionNodes.length-1"
                       @click="arrTransfer(index)">&gt;
                  </div>
                  <div class="content" @click="setPerson(item.priorityLevel)">{{conditionStr(item,index)}}</div>
                  <div class="error_tip" v-if="isTried&&item.error">
                    <i class="anticon anticon-exclamation-circle" style="color: rgb(242, 86, 67);"></i>
                  </div>
                </div>
                <addNode :childNodeP.sync="item.childNode"></addNode>
              </div>
            </div>
            <nodeWrap v-if="item.childNode && item.childNode" :nodeConfig.sync="item.childNode" :tableId="tableId"
                      :isTried.sync="isTried" :directorMaxLevel="directorMaxLevel"></nodeWrap>
            <div class="top-left-cover-line" v-if="index==0"></div>
            <div class="bottom-left-cover-line" v-if="index==0"></div>
            <div class="top-right-cover-line" v-if="index==nodeConfig.conditionNodes.length-1"></div>
            <div class="bottom-right-cover-line" v-if="index==nodeConfig.conditionNodes.length-1"></div>
          </div>
        </div>
        <addNode :childNodeP.sync="nodeConfig.childNode"></addNode>
      </div>
    </div>

    <el-drawer direction="rtl" :append-to-body="true"
               :title="approverConfig.nodeName"
               width="70%"
               custom-class="el-drawer-custom"
               :mask-closable="false"
               :visible.sync="startApproverDrawer"
               :styles="styles"
    >
      <Form :model="userForm" label-position="top" style="margin-left: 20px">

        <FormItem label="审批人设置" v-if='userForm.operateType=="1"  && startApproverDrawer' style="width: 100%">
          <RadioGroup v-model="userForm.operate" type="button" @on-change="change">
            <Radio label="3">操作权限</Radio>
            <Radio label="2"> 表单权限</Radio>
          </RadioGroup>
        </FormItem>
        <el-table :data="userForm.btnList" fit highlight-current-row style="width: 100%" v-if='userForm.operate=="3"'>
          <el-table-column label="按钮名称"
                           prop="btnName"
                           show-overflow-tooltip>
          </el-table-column>
          <el-table-column label="开启"
                           prop="enable"
                           show-overflow-tooltip>
            <template slot-scope="scope">
              <el-checkbox true-label="true" v-model="scope.row.enable"></el-checkbox>
            </template>
          </el-table-column>
        </el-table>
        <el-table :data="userForm.fields" border fit highlight-current-row style="width: 100%"
                  v-if='userForm.operate=="2" && startApproverDrawer'>
          <el-table-column label="表单字段描述"
                           prop="description"
                           show-overflow-tooltip>
          </el-table-column>
          <el-table-column label="可读"
                           prop="read"
                           show-overflow-tooltip>
            <template slot-scope="scope">
              <el-checkbox true-label="true" v-model="scope.row.read"></el-checkbox>
            </template>
          </el-table-column>
          <el-table-column label="编辑"
                           prop="write"
                           show-overflow-tooltip>
            <template slot-scope="scope">
              <el-checkbox true-label="true" v-model="scope.row.write"></el-checkbox>
            </template>
          </el-table-column>
          <el-table-column label="隐藏"
                           prop="hidden"
                           show-overflow-tooltip>
            <template slot-scope="scope">
              <el-checkbox true-label="true" v-model="scope.row.hidden"></el-checkbox>
            </template>
          </el-table-column>
        </el-table>
      </Form>

      <div class="demo-drawer-footer">
        <Button type="primary" @click="saveStartConfig()">保存</Button>
        <Button style="margin-right: 8px" @click="startApproverDrawer = false">取消</Button>

      </div>
    </el-drawer>

    <div>
      <el-drawer direction="rtl" :append-to-body="true"
                 :title="approverConfig.nodeName"
                 width="70%"
                 :visible.sync="approverDrawer"
                 :styles="styles" class="a_"
      >

        <Form :model="userForm" label-position="top" style="margin-left: 20px">
          <FormItem label="审批类型">
            <RadioGroup v-model="userForm.operateType" type="button" @on-change="operateTypeChange">
              <Radio label="1"> 人工审批</Radio>
              <Radio label="2"> 自动通过</Radio>
            </RadioGroup>

          </FormItem>
          <FormItem label="审批人设置" v-if='userForm.operateType==="1"' style="width: 100%">
            <RadioGroup v-model="userForm.operate" type="button" @on-change="change"	>
              <Radio label="1"> 设置审批人</Radio>
              <Radio label="2"> 表单权限</Radio>
              <Radio label="3">操作权限</Radio>
            </RadioGroup>
          </FormItem>


          <el-table :data="userForm.btnList" fit highlight-current-row
                    max-height="450"
                    style="width: 100%" v-if='userForm.operate=="3"'>
            <el-table-column label="按钮名称"
                             prop="btnName"
                             show-overflow-tooltip>
            </el-table-column>
            <el-table-column label="开启"
                             prop="enable"
                             show-overflow-tooltip>
              <template slot-scope="scope">
                <el-checkbox true-label="true" v-model="scope.row.enable"></el-checkbox>
              </template>
            </el-table-column>
          </el-table>
          <el-table :data="userForm.fields" border fit highlight-current-row style="width: 100%"
                    v-if='userForm.operate=="2"'>
            <el-table-column label="表单字段描述"
                             prop="description"
                             show-overflow-tooltip>
            </el-table-column>
            <el-table-column label="可读"
                             prop="read"
                             show-overflow-tooltip>
              <template slot-scope="scope">
                <el-checkbox true-label="true" v-model="scope.row.read"></el-checkbox>
              </template>
            </el-table-column>
            <el-table-column label="编辑"
                             prop="write"
                             show-overflow-tooltip>
              <template slot-scope="scope">
                <el-checkbox true-label="true" v-model="scope.row.write"></el-checkbox>
              </template>
            </el-table-column>
            <el-table-column label="隐藏"
                             prop="hidden"
                             show-overflow-tooltip>
              <template slot-scope="scope">
                <el-checkbox true-label="true" v-model="scope.row.hidden"></el-checkbox>
              </template>
            </el-table-column>
          </el-table>
          <span @click="addUser" v-if='userForm.operateType=="1" && userForm.operate=="1"'
                style="line-height: 24px;color: #3370ff;line-height: 24px;
    color: #3370ff;
    cursor: pointer;font-size: 14px;">
                      <Icon type="md-add"/>添加审批人
  </span>
          <Card v-if='userForm.operateType=="1" && userForm.operate=="1"' style="width:100%;margin-top: 20px"
                v-for="(key,index) in userForm.nodeUserList">
            <p slot="title">
              审批人
            </p>
            <a href="#" slot="extra" @click.prevent="deleteUserRule(index)">
              <Icon type="md-trash"/>
            </a>
            <el-radio-group v-model="key.ruleType">
              <el-radio :label="item.label" v-for="(item,indexKey) in userRuleList"
                        @change="changeUserRule(item.label,index)">
                <span>{{item.val}}</span>
              </el-radio>
            </el-radio-group>

            <FormItem label="选择角色" v-if='key.ruleType=="3"' style="margin-top: 30px;">
              <el-select v-model="key.role" multiple placeholder="请选择" style="width: 100%">
                <el-option
                  v-for="item in options"
                  :key="item.name"
                  :label="item.name"
                  :value="item.code">
                </el-option>
              </el-select>
            </FormItem>
            <FormItem label="添加成员" v-if='key.ruleType=="4"' style="margin-top: 30px;">
              <Button type="error" @click="selectNodeShowUsers(index)">
                <Icon type="ios-contact"/>
                添加
              </Button>
              <Button
                v-for="(userItem,userIndex) in key.users"
                type="primary"
                style="margin-left: 2px"
                color="primary"
                @click="delNodeCommonUsers(index,userIndex)"
              >
                {{ userItem.fullname }} &nbsp;<Icon type="md-close"/>
              </Button>
            </FormItem>
          </Card>
          <FormItem prop="type" label="审批人为空时" style="margin-top: 30px;"
                    v-if='userForm.operateType=="1" '>
            <el-radio-group v-model="nodeConfig.operateNullUser">
              <el-radio :label="item.label" v-for="(item,indexKey) in userNullRuleList"
                        @change="changeUserRule(item.label,index)">
                <span>{{item.val}}</span>
              </el-radio>
            </el-radio-group>
          </FormItem>

          <FormItem prop="type" label="指定用户审批" style="margin-top: 30px;"
                    v-if="nodeConfig.operateNullUser=='2' && userForm.operateType=='1'">
            <Button type="error" @click="selectSpecShowUsers(index,'nullUserStrategy')">
              <Icon type="ios-contact"/>
              添加
            </Button>
            <Button
              v-for="(userItem,userIndex) in nodeConfig.nullNodeUserList"
              type="primary"
              style="margin-left: 2px"
              color="primary"
              @click="delCommonUsers(userIndex)"
            >
              {{ userItem.fullname }} &nbsp;<Icon type="md-close"/>
            </Button>
          </FormItem>
          <FormItem prop="type" label="审批人与发起人为同一人时" style="margin-top: 30px;"
                    v-if='userForm.operateType=="1" && userForm.operate=="1"'>
            <el-radio-group v-model="userForm.operateNullUserStrategy">
              <el-radio style="width: 250px;margin-top: 15px" :label="item.label"
                        v-for="(item,indexKey) in operateNullUserStrategyList"
                        @change="changeUserRule(item.label,index)">
                <span>{{item.val}}</span>
              </el-radio>
            </el-radio-group>
          </FormItem>
        </Form>
        <user-multiple-dialog
          :on-ok="confirmDialogEvent"
          :show.sync="show"
          :exist-data="existData"
        />

        <div class="demo-drawer-footer">
          <Button type="primary" @click="saveConfig()">保存</Button>

          <Button style="margin-right: 8px" @click="approverDrawer = false">取消</Button>
        </div>


      </el-drawer>
    </div>
    <el-drawer :append-to-body="true" title="抄送人设置" :visible.sync="copyerDrawer" direction="rtl" class="set_copyer"
               size="550px" :before-close="saveCopyer">
      <div class="demo-drawer__content">
        <div class="copyer_content drawer_content">
          <el-button type="primary" @click="addCopyer">添加成员</el-button>
          <p class="selected_list">
                        <span v-for="(item,index) in copyerConfig.nodeUserList" :key="index">{{item.name}}
                            <img src="@/assets/images/add-close1.png"
                                 @click="removeEle(copyerConfig.nodeUserList,item,'targetId')">
                        </span>
            <a v-if="copyerConfig.nodeUserList&&copyerConfig.nodeUserList.length!=0"
               @click="copyerConfig.nodeUserList=[]">清除</a>
          </p>
          <el-checkbox-group v-model="ccSelfSelectFlag" class="clear">
            <el-checkbox :label="1">允许发起人自选抄送人</el-checkbox>
          </el-checkbox-group>
        </div>
        <div class="demo-drawer-footer">
          <el-button type="primary" @click="saveCopyer">确 定</el-button>
          <el-button @click="copyerDrawer = false">取 消</el-button>
        </div>

      </div>
      <el-dialog title="选择成员" :visible.sync="copyerVisible" width="600px" append-to-body class="promoter_person">
        <div class="person_body clear">
          <div class="person_tree l" style=" float: left;">
            <input type="text" v-model="copyerSearchName" @input="getDebounceData($event,activeName)">
            <el-tabs v-model="activeName" @tab-click="handleClick">
              <el-tab-pane label="用户" name="1"></el-tab-pane>
              <el-tab-pane label="角色列表" name="2"></el-tab-pane>
            </el-tabs>
            <ul style="height: 360px;" v-if="activeName==1">
              <li v-for="(item,index) in users" :key="index+'c'" class="check_box">
                <a :class="toggleClass(copyerUsersList,item,'id')&&'active'"
                   @click="toChecked(copyerUsersList,item,'id')" :title="item.fullname">
                  <img src="@/assets/images/icon_role.png">{{item.fullname}}</a>
              </li>
            </ul>
            <ul style="height: 360px;" v-if="activeName==2">
              <li v-for="(item,index) in roles" :key="index+'c'" class="check_box">
                <a :class="toggleClass(copyerRoleList,item,'id')&&'active'" @click="toChecked(copyerRoleList,item,'id')"
                   :title="item.name">
                  <img src="@/assets/images/icon_role.png">{{item.name}}</a>
              </li>
            </ul>
          </div>
          <div class="has_selected l" style=" float: left;">
            <p class="clear">已选（{{copyerUsersList.length+copyerRoleList.length}}）
              <a @click="copyerUsersList=[];copyerRoleList=[]">清空</a>
            </p>
            <ul>
              <li v-for="(item,index) in copyerRoleList" :key="index+'e'">
                <img style="width: 14px;
    vertical-align: middle;
    margin-right: 5px;" src="@/assets/images/icon_role.png">
                <span>{{item.name}}</span>
                <img style="width: 14px;
    vertical-align: middle;
    margin-right: 5px;" src="@/assets/images/cancel.png" @click="removeEle(copyerRoleList,item,'id')">
              </li>

              <li v-for="(item,index) in copyerUsersList" :key="index+'e1'">
                <img style="width: 14px;
    vertical-align: middle;
    margin-right: 5px;" src="@/assets/images/icon_people.png">
                <span>{{item.fullname}}</span>
                <img style="width: 14px;
    vertical-align: middle;
    margin-right: 5px;" src="@/assets/images/cancel.png" @click="removeEle(copyerUsersList,item)">
              </li>
            </ul>
          </div>

        </div>
        <div slot="footer" class="dialog-footer">
          <el-button @click="copyerVisible = false">取 消</el-button>
          <el-button type="primary" @click="sureCopyer">确 定</el-button>

        </div>
      </el-dialog>
    </el-drawer>

    <div>
      <el-drawer :append-to-body="true" title="条件设置" :visible.sync="conditionDrawer" direction="rtl"
                 width="70%"
                 style="　overflow-y:scroll;"
                 class="condition_copyer a_" :before-close="saveCondition">
        <select v-model="conditionConfig.priorityLevel" class="priority_level">
          <option v-for="item in conditionsConfig.conditionNodes.length" :value="item" :key="item">优先级{{item}}</option>
        </select>

        <span @click="addCondition" v-if='userForm.operateType=="1" && userForm.operate=="1"' style="line-height: 24px;
    color: #3370ff;">
                      <Icon type="md-add"/>添加条件组
           </span>
        <div :style='styles'>
          <Form :model="conditionForm" label-position="top" style="margin-left: 20px">
            <Card style="width:100%;margin-top: 20px;padding-right: 20px" v-for="(item,index) in conditionForm">
              <p slot="title">
                条件组
              </p>

              <span v-for="(item_,index_) in item">
              <div class="condition-relation">   {{item_.operateName}}   <a v-if="index_>0" href="#" slot="extra"
                                                                            @click.prevent="deleteConditionItem(index,index_)">
              <Icon type="md-trash"/>
            </a></div>
          <p>

            </p>
                          <el-select v-model="item_.condition" placeholder="请选择" style="width: 100%">

                            <el-option
                              v-for="item3 in conditionVarList"
                              :key="item3.key"
                              :label="item3.value"
                              :value="item3.key">
                            </el-option>
                          </el-select>
                          <el-select v-model="item_.optType" placeholder="请选择" style="width: 100%;margin-top: 10px">
              <el-option value="<" label="小于">小于</el-option>
              <el-option value=">" label="大于">大于</el-option>
              <el-option value="<=" label="小于等于">小于等于</el-option>
              <el-option value="==" label="等于">等于</el-option>
              <el-option value=">=" label="大于等于">大于等于</el-option>
            </el-select>
                          <el-input v-model="item_.value" placeholder=""
                                    style="width: 100%;margin-top: 10px"></el-input>

                          <span @click="addConditionItem(item_,index,index_)"
                                style="line-height: 24px;;margin-top: 10px;color: #3370ff;">
                                    <Icon type="md-add"/>添加条件
                         </span>

            </span>


              <a href="#" slot="extra" @click.prevent="deleteCondition(index)">
                <Icon type="md-trash"/>
              </a>
            </Card>

          </Form>
        </div>

        <div class="demo-drawer-footer">
          <el-button type="primary" @click="saveCondition">确 定</el-button>
          <el-button @click="conditionDrawer = false">取 消</el-button>
        </div>
      </el-drawer>

    </div>

    <nodeWrap v-if="nodeConfig.childNode && nodeConfig.childNode" :nodeConfig.sync="nodeConfig.childNode"
              :tableId="tableId"
              :isTried.sync="isTried" :directorMaxLevel="directorMaxLevel"></nodeWrap>
  </div>
</template>
<script>
  import userMultipleDialog from '@/views/components/org/userMultipleDialog'
  import {getAllRole, getUser} from "@/api/uc";
  import {condition, objJsonByFormKey} from '@/api/form'
  import {listBtn} from "@/api/btn";

  function S4() {
    return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
  }

  function guid() {
    return (S4() + S4() + "-" + S4() + "-" + S4() + "-" + S4() + "-" + S4() + S4() + S4());
  }

  export default {
    components: {
      userMultipleDialog
    },
    props: ["nodeConfig", "flowPermission", "directorMaxLevel", "isTried", "tableId","node"],
    data() {
      return {
        alia:'',
        placeholder: '搜索用户',
        fields: [],
        nodeList: [],
        queryForm: {
          page: 1,
          limit: 1000,
          pageSize: 1000,
          name: "",
        },
        queryUserForm: {
          page: 1,
          length: 10000,
          pageSize: 10000,
          name: "",
          fullname: "",
          mobile: "",
        },
        queryBusForm: {
          page: 1,
          length: 10,
          objName: "",
          objDesc: "",
          objKey: "applyformoney",
        },
        show: false,
        index: null,
        strategy: null,
        existData: [],
        options: [],
        userRuleList: [
          {label: '1', val: '上级'},
          {label: '2', val: '部门负责人'},
          {label: '3', val: '角色'},
          {label: '4', val: '指定成员'},
          {label: '5', val: '发起人本人'}

        ],
        userNullRuleList: [
          {label: '1', val: '自动通过'},
          {label: '2', val: '指定人员审批'},
          {label: '3', val: '转交给审批管理员'},
        ],
        operateNullUserStrategyList: [
          {label: '1', val: '由发起人对自己审批'},
          {label: '2', val: '自动跳过'},
          {label: '3', val: '转交给直属上级审批'},
          {label: '4', val: '转交给部门负责人审批'},
        ],
        tableNodeData: [],
        nodeFormList: [],
        conditionForm: {},
        userForm: {
          title: '',
          operate: '1',
          operateType: '1',
          operateNullUser: '1',
          operateNullUserStrategy: '1',
          userList: [],
          btnList: [],
          nodeUserList: [],
          fields: [],
          nullNodeUserList: []
        },
        startForm: {
          title: '',
          operate: '2',
          operateType: '1',
          operateNullUser: '1',
          operateNullUserStrategy: '1',
          userList: [],
          btnList: [],
          nodeUserList: [],
          fields: [],
          nullNodeUserList: []
        },
        placeholderList: ["发起人", "审核人", "抄送人"],
        isInputList: [],
        isInput: false,
        promoterVisible: false,
        promoterDrawer: false,
        departments: {},
        checkedDepartmentList: [],
        checkedEmployessList: [],
        promoterSearchName: "",
        flowPermission1: this.flowPermission,
        approverDrawer: false,
        startApproverDrawer: false,
        styles: {
          height: 'calc(100% - 55px)',
          overflow: 'auto',
          paddingBottom: '53px',
          position: 'static'
        },
        approverVisible: false,
        approverRoleVisible: false,
        approverConfig: {},
        approverEmplyessList: [],
        approverSearchName: "",
        roles: [],
        users: [],
        roleList: [],
        approverRoleSearchName: "",
        copyerDrawer: false,
        copyerVisible: false,
        copyerConfig: {},
        copyerSearchName: "",
        activeName: "1",
        copyerEmployessList: [],
        copyerRoleList: [],
        copyerUsersList: [],
        ccSelfSelectFlag: [],
        conditionDrawer: false,
        conditionVisible: false,
        conditionConfig: {},
        conditionsConfig: {
          conditionNodes: [],
        },
        bPriorityLevel: "",
        conditions: [],
        conditionList: [],
        conditionForm: [],
        conditionVarList: [],
        conditionRoleVisible: false,
        conditionRoleSearchName: "",
        conditionDepartmentList: [],
        conditionEmployessList: [],
        conditionRoleList: [],
        btnList: [],
      }
    },
    mounted() {
      if (this.nodeConfig.type == 1) {
        this.nodeConfig.error = !this.setApproverStr(this.nodeConfig)
      } else if (this.nodeConfig.type == 2) {
        this.nodeConfig.error = !this.copyerStr(this.nodeConfig)
      } else if (this.nodeConfig.type == 4) {
        for (var i = 0; i < this.nodeConfig.conditionNodes.length; i++) {
          this.nodeConfig.conditionNodes[i].error = this.conditionStr(this.nodeConfig.conditionNodes[i], i) == "请设置条件" && i != this.nodeConfig.conditionNodes.length - 1
        }
      }
    },
    created() {

      this.getData()
      this.operateConditionVarList()
    },
    methods: {
      change(e){
        if (e==="2"){
          if( this.userForm.fields && this.userForm.fields.length>0){
          }else{
            this.userForm.fields=this.getNodeForm();

          }
        }
      },
      getNodeForm(){
        var nodeFormList=    localStorage.getItem("nodeFormList");
        if (nodeFormList){
          return   JSON.parse(nodeFormList);
        }else{
          return [];
        }
      },
      operateTypeChange(data) {
        this.userForm.operateType = data
      },
      getUser: function () {
        getUser(this.queryUserForm).then((response) => {
          this.users = response.page.aaData;
        })
      },
      getForm(){
        var form_json = this.$refs.container.handleFixedJson(data.formJsonStr);
      },
      getBtnList(type) {
        if (this.approverConfig) {
          if (this.approverConfig.btnList && this.approverConfig.btnList.length > 0) {
            this.userForm.nullNodeUserList = this.approverConfig.nullNodeUserList
            return
          }
        }
        listBtn({
          pageNum: 1,
          pageSize: 10000,
          btnName: null,
          btnAlias: null,
          cssName: null,
          btnType: null,
        }).then(response => {
          var obj = JSON.parse(response.data)
          obj.UserTask.forEach((value, index) => {
            value['enable'] = true
          })
          obj.StartEvent.forEach((value, index) => {
            value['enable'] = true
          })
          if (type == '0') {
            obj = obj.StartEvent

          } else if (type == '1') {
            obj = obj.UserTask
          }
          this.userForm.btnList = obj
        });
      },
      getAllBus: function () {
        if (this.approverConfig) {
          if (this.approverConfig.formFields && this.approverConfig.formFields.length > 0) {
            this.userForm.fields = this.approverConfig.formFields
            return
          }
        }
        var pangu_formKey = localStorage.getItem('pangu_formKey');
        if (pangu_formKey) {
          objJsonByFormKey(pangu_formKey).then((response) => {
            if (response.code == 0) {
              var tableNodeData = response.data;
              var fields = [];
              for (var i = 0; i < tableNodeData.length; i++) {
                var fields_ = tableNodeData[i].fields;
                fields = fields_.concat(fields);
              }
              this.userForm.fields = fields;
            }
          })

        }

      },
      init() {
        if (this.approverConfig.operateType) {
          this.userForm.operateType = this.approverConfig.operateType
        }
        if (this.approverConfig.operateNullUserStrategy) {
          this.userForm.operateNullUserStrategy = this.approverConfig.operateNullUserStrategy
        }
        if (this.approverConfig.operateNullUser) {
          this.userForm.operateNullUser = this.approverConfig.operateNullUser
        }
        if (this.approverConfig.nodeUserList) {
          this.userForm.nodeUserList = this.approverConfig.nodeUserList

        }
        if (this.approverConfig.nullNodeUserList) {
          this.userForm.nullNodeUserList = this.approverConfig.nullNodeUserList
        }
        if (this.approverConfig.operateNullUser) {
          this.userForm.operateNullUser = this.approverConfig.operateNullUser
        }
        if (this.approverConfig.btnList) {
          this.userForm.btnList = this.approverConfig.btnList
        }
        if (this.approverConfig.formFields) {
          this.fields = this.approverConfig.formFields
          // localStorage.setItem("nodeFormList",JSON.stringify(  this.fields) );

        }
      },
      saveStartConfig() {
        this.approverConfig.formFields = this.userForm.fields
        this.approverConfig.btnList = this.userForm.btnList
        this.startApproverDrawer = false
      },

      saveConfig() {
        this.approverConfig.operateType = this.userForm.operateType
        this.approverConfig.operateNullUser = this.userForm.operateNullUser
        this.approverConfig.operateNullUserStrategy = this.userForm.operateNullUserStrategy
        this.approverConfig.nodeUserList = this.userForm.nodeUserList
        this.approverConfig.nullNodeUserList = this.userForm.nullNodeUserList
        this.approverConfig.operateNullUser = this.userForm.operateNullUser
        this.approverConfig.btnList = this.userForm.btnList
        this.approverConfig.formFields = this.userForm.fields
        this.nodeConfig.operateType = this.userForm.operateType
        this.$emit("update:nodeConfig", this.nodeConfig);
        this.approverDrawer = false;
      },
      getData: function () {
        getAllRole(this.queryForm).then((response) => {
          this.options = response.data
          this.roles = response.data;
        })
      },
      delCommonUsers(index, itemIndex) {
        this.nodeConfig.nullNodeUserList.splice(index, 1);
      },
      confirmDialogEvent: function (data) {
        if (this.alia=='selectNodeShowUsers'){
          this.userForm.nodeUserList[this.index]['users']=data
        }else{
          this.nodeConfig.nullNodeUserList = data;

        }
      },
      selectShowUsers(index, strategy) {
        this.index = index;
        this.strategy = strategy;
        this.existData = this.nodeConfig.nullNodeUserList

        this.show = true
      },
      selectNodeShowUsers(index, strategy) {
        this.index = index;
        this.strategy = strategy;
        this.alia='selectNodeShowUsers'
        this.existData = this.nodeConfig.nodeUserList[this.index]['users']
        this.show = true
      },
      selectSpecShowUsers(index, strategy) {
        this.index = index;
        this.strategy = strategy;
        this.show = true
        this.existData = this.nodeConfig.nullNodeUserList
        //this.nodeConfig.nullNodeUserList  = this.userForm.nullNodeUserList

      },

      deleteUserRule(index) {
        this.userForm.nodeUserList.splice(index, 1);

      },

      delNodeCommonUsers(index,userIndex) {
        this.userForm.nodeUserList[index]['users'].splice(userIndex, 1);

      },

      addUser() {
        this.userForm.nodeUserList.push({ruleType: '1', users: [], role: []})
      },
      changeUserRule(data, index) {
        this.approverConfig.ruleType = data

      },

      clickEvent(index) {
        if (index || index === 0) {
          this.$set(this.isInputList, index, true)
        } else {
          this.isInput = true;
        }
      },
      blurEvent(index) {
        if (index || index === 0) {
          this.$set(this.isInputList, index, false)
          this.nodeConfig.conditionNodes[index].nodeName = this.nodeConfig.conditionNodes[index].nodeName ? this.nodeConfig.conditionNodes[index].nodeName : "条件"
        } else {
          this.isInput = false;
          this.nodeConfig.nodeName = this.nodeConfig.nodeName ? this.nodeConfig.nodeName : this.placeholderList[this.nodeConfig.type]
        }
      },
      conditionStr(item, index) {
        var {conditionList, nodeUserList} = item;
        if (conditionList.length == 0) {
          return (index == this.nodeConfig.conditionNodes.length - 1) && this.nodeConfig.conditionNodes[0].conditionList.length != 0 ? '其他条件进入此流程' : '请设置条件'
        } else {
          let str = ""
          for (var i = 0; i < conditionList.length; i++) {
            var {columnId, columnType, showType, showName, optType, zdy1, opt1, zdy2, opt2, fixedDownBoxValue} = conditionList[i];
            if (columnId == 0) {
              if (nodeUserList.length != 0) {
                str += '发起人属于：'
                str += nodeUserList.map(item => {
                  return item.name
                }).join("或") + " 并且 "
              }
            }
            if (columnType == "String" && showType == "3") {
              if (zdy1) {
                str += showName + '属于：' + this.dealStr(zdy1, JSON.parse(fixedDownBoxValue)) + " 并且 "
              }
            }
            if (columnType == "Double") {
              if (optType != 6 && zdy1) {
                var optTypeStr = ["", "<", ">", "≤", "=", "≥"][optType]
                str += `${showName} ${optTypeStr} ${zdy1} 并且 `
              } else if (optType == 6 && zdy1 && zdy2) {
                str += `${zdy1} ${opt1} ${showName} ${opt2} ${zdy2} 并且 `
              }
            }
          }
          return str ? str.substring(0, str.length - 4) : '请设置条件'
        }
      },
      dealStr(str, obj) {
        let arr = [];
        let list = str.split(",");
        for (var elem in obj) {
          list.map(item => {
            if (item == elem) {
              arr.push(obj[elem].value)
            }
          })
        }
        return arr.join("或")
      },
      addConditionRole() {
        this.conditionRoleSearchName = "";
        this.conditionRoleVisible = true;
        this.activeName = "1";
        this.getDepartmentList();
        this.conditionDepartmentList = [];
        this.conditionEmployessList = [];
        this.conditionRoleList = [];
        for (var i = 0; i < this.conditionConfig.nodeUserList.length; i++) {
          var {type, name, targetId} = this.conditionConfig.nodeUserList[i];
          if (type == 1) {
            this.conditionEmployessList.push({
              fullname: name,
              id: targetId
            });
          } else if (type == 2) {
            this.conditionRoleList.push({
              roleName: name,
              id: targetId
            });
          } else if (type == 3) {
            this.conditionDepartmentList.push({
              departmentName: name,
              id: targetId
            });
          }
        }
      },
      sureConditionRole() {
        this.conditionConfig.nodeUserList = [];
        this.conditionRoleList.map(item => {
          this.conditionConfig.nodeUserList.push({
            type: 2,
            targetId: item.roleId,
            name: item.roleName
          })
        });
        this.conditionDepartmentList.map(item => {
          this.conditionConfig.nodeUserList.push({
            type: 3,
            targetId: item.id,
            name: item.departmentName
          })
        });
        this.conditionEmployessList.map(item => {
          this.conditionConfig.nodeUserList.push({
            type: 1,
            targetId: item.id,
            name: item.employeeName
          })
        });
        this.conditionRoleVisible = false;
      },
      deleteCondition(index) {
        this.conditionForm.splice(index, 1);

      },
      addConditionItem(item_, index, index_) {
        var operateName = '当';
        if (this.conditionForm[index].length >= 1) {
          operateName = '或'
        }

        this.conditionForm[index].push({
          operateName: operateName,
          operateCode: 'and',
          optType: '',
          condition: '',
          value: ''
        })
      },
      deleteConditionItem(index, index_) {
        this.conditionForm[index].splice(index_, 1);
      },
      operateConditionVarList:function(){
        var pangu_formKey=  this.getNodeForm();
        var field_=[]
        if (pangu_formKey){
          for (var i = 0; i <pangu_formKey.length ; i++) {
            var field=   pangu_formKey[i];
            field_.push({"value":field.description,"key":field.model})
          }
        }
        this.conditionVarList = field_;
      },
      addCondition() {
        this.operateConditionVarList();
        var data = [];

        data.push({operateName: '当', operateCode: 'and', optType: '', condition: '', value: ''})
        this.conditionForm.push(data)

        this.conditionList = [];
        this.conditionVisible = true;
        // this.conditions = obj.data;
        if (this.conditionConfig.conditionList) {
          for (var i = 0; i < this.conditionConfig.conditionList.length; i++) {

            var {columnId} = this.conditionConfig.conditionList[i]
            if (columnId == 0) {
              this.conditionList.push({columnId: 0})
            } else {
              this.conditionList.push(this.conditions.filter(item => {
                return item.columnId == columnId;
              })[0])
            }
          }
        }
      },
      changeOptType(item) {
        if (item.optType == 1) {
          item.zdy1 = 2;
        } else {
          item.zdy1 = 1;
          item.zdy2 = 2;
        }
      },
      sureCondition() {
        //1.弹窗有，外面无+
        //2.弹窗有，外面有不变
        for (var i = 0; i < this.conditionList.length; i++) {
          var {columnId, showName, columnName, showType, columnType, fixedDownBoxValue} = this.conditionList[i];
          if (this.toggleClass(this.conditionConfig.conditionList, this.conditionList[i], "columnId")) {
            continue;
          }
          if (columnId == 0) {
            this.conditionConfig.nodeUserList == [];
            this.conditionConfig.conditionList.push({
              "type": 1,
              "columnId": columnId,
              "showName": '发起人'
            });
          } else {
            if (columnType == "Double") {
              this.conditionConfig.conditionList.push({
                "showType": showType,
                "columnId": columnId,
                "type": 2,
                "showName": showName,
                "optType": "1",
                "zdy1": "2",
                "opt1": "<",
                "zdy2": "",
                "opt2": "<",
                "columnDbname": columnName,
                "columnType": columnType,
              })
            } else if (columnType == "String" && showType == "3") {
              this.conditionConfig.conditionList.push({
                "showType": showType,
                "columnId": columnId,
                "type": 2,
                "showName": showName,
                "zdy1": "",
                "columnDbname": columnName,
                "columnType": columnType,
                "fixedDownBoxValue": fixedDownBoxValue
              })
            }
          }
        }
        ////3.弹窗无，外面有-
        for (let i = this.conditionConfig.conditionList.length - 1; i >= 0; i--) {
          if (!this.toggleClass(this.conditionList, this.conditionConfig.conditionList[i], "columnId")) {
            this.conditionConfig.conditionList.splice(i, 1);
          }
        }
        this.conditionConfig.conditionList.sort(function (a, b) {
          return a.columnId - b.columnId;
        });
        this.conditionVisible = false;
      },
      saveCondition() {
        var a = this.conditionsConfig.conditionNodes.splice(this.bPriorityLevel - 1, 1)//截取旧下标
        this.conditionsConfig.conditionNodes.splice(this.conditionConfig.priorityLevel - 1, 0, a[0])//填充新下标
        this.conditionsConfig.conditionNodes.map((item, index) => {
          item.priorityLevel = index + 1
        });
        this.conditionConfig.conditionList = this.conditionForm
        for (var i = 0; i < this.conditionsConfig.conditionNodes.length; i++) {
          this.conditionsConfig.conditionNodes[i].error = this.conditionStr(this.conditionsConfig.conditionNodes[i], i) == "请设置条件" && i != this.conditionsConfig.conditionNodes.length - 1
        }
        this.conditionDrawer = false;

        this.$emit("update:nodeConfig", this.conditionsConfig);
      },
      getDebounceData(event, type = 1) {
        if (event.target.value) {
          if (type == 1) {
            this.placeholder = '搜索用户'
            this.queryUserForm.fullname = event.target.value;
            this.getUser();
          } else {
            this.placeholder = '搜索角色'
            this.queryForm.name = event.target.value
            this.getData();
          }
        } else {

          this.queryForm.name = ''
          this.queryUserForm.fullname = ''
          type == 1 ? this.getUser() : this.getData();
        }
      },
      handleClick() {
        this.copyerSearchName = "";
        this.conditionRoleSearchName = "";
        if (this.activeName == 1) {
          this.getUser();
        } else {
          this.getData();
        }
      },
      addCopyer() {
        this.copyerSearchName = "";
        this.copyerVisible = true;
        this.activeName = "1";
        this.getUser();
        this.copyerUsersList = [];
        this.copyerRoleList = [];
        for (var i = 0; i < this.copyerConfig.nodeUserList.length; i++) {
          var {type, name, targetId} = this.copyerConfig.nodeUserList[i];
          if (type == 1) {
            this.copyerUsersList.push({
              fullname: name,
              id: targetId
            });
          } else if (type == 2) {

            this.copyerRoleList.push({
              name: name,
              code: name,
              id: targetId
            });
          }
        }
      },
      sureCopyer() {
        this.copyerConfig.nodeUserList = [];
        this.copyerRoleList.map(item => {
          this.copyerConfig.nodeUserList.push({
            type: 2,
            targetId: item.id,
            name: item.name
          })
        });
        this.copyerUsersList.map(item => {
          this.copyerConfig.nodeUserList.push({
            type: 1,
            targetId: item.userNo,
            name: item.fullname
          })
        });
        this.copyerVisible = false;
      },
      saveCopyer() {
        this.copyerConfig.ccSelfSelectFlag = this.ccSelfSelectFlag.length == 0 ? 0 : 1;
        this.copyerConfig.error = !this.copyerStr(this.copyerConfig);
        this.$emit("update:nodeConfig", this.copyerConfig);
        this.copyerDrawer = false;
      },
      copyerStr(nodeConfig) {
        if (nodeConfig.nodeUserList.length != 0) {
          return this.arrToStr(nodeConfig.nodeUserList)
        } else {
          if (nodeConfig.ccSelfSelectFlag == 1) {
            return "发起人自选"
          }
        }
      },
      changeRange() {
        this.approverConfig.nodeUserList = [];
      },
      changeType(val) {
        this.approverConfig.nodeUserList = [];
        this.approverConfig.examineMode = 1;
        this.approverConfig.noHanderAction = 2;
        if (val == 2) {
          this.approverConfig.directorLevel = 1;
        } else if (val == 4) {
          this.approverConfig.selectMode = 1;
          this.approverConfig.selectRange = 1;
        } else if (val == 7) {
          this.approverConfig.examineEndDirectorLevel = 1
        }
      },
      setApproverStr(nodeConfig) {
        var id = nodeConfig.id;
        var disPlayName = "";
        this.nodeConfig = nodeConfig
        if (nodeConfig.nodeUserList && nodeConfig.nodeUserList.length > 0) {
          this.userForm.nodeUserList = nodeConfig.nodeUserList
        }
        if (this.nodeConfig.btnList && this.nodeConfig.btnList.length > 0) {
          this.userForm.btnList = this.nodeConfig.btnList
        }
        if (this.userForm.btnList && this.userForm.btnList.length > 0) {
          this.nodeConfig.btnList = this.userForm.btnList
        }
        if (this.userForm.nodeUserList && this.userForm.nodeUserList.length > 0) {
          var name = ''
          this.nodeConfig.nodeUserList = this.userForm.nodeUserList
          this.userForm.nodeUserList.forEach((item, index, array) => {
            let fh = ',';
            if (item.users) {
              let strTag = item.users.map(function (obj, index) {
                if (obj != null) {
                  if (obj.fullname != null) {
                    return obj.fullname;
                  } else {
                    fh = ''
                  }
                } else {
                  fh = ''
                }
              }).join(fh);
              disPlayName += strTag
            }
            if (item.role) {
              disPlayName += item.role.join(", ")
            }
            if (item.ruleType == 1) {
              disPlayName += ',上级 '
            }
            if (item.ruleType == 2) {
              disPlayName += ',部门负责人 '
            }
            if (item.ruleType == 5) {
              disPlayName += ',发起人本人 '
            }
            //执行代码
            if (",".startsWith(disPlayName)) {
              disPlayName = disPlayName.substr(0, 1)
            }

          })
        }
        return disPlayName;

        if (nodeConfig.settype == 1) {


          if (nodeConfig.nodeUserList.length == 1) {
            return nodeConfig.nodeUserList[0].name
          } else if (nodeConfig.nodeUserList.length > 1) {
            if (nodeConfig.examineMode == 1) {
              return this.arrToStr(nodeConfig.nodeUserList)
            } else if (nodeConfig.examineMode == 2) {
              return nodeConfig.nodeUserList.length + "人会签"
            }
          }
        } else if (nodeConfig.settype == 2) {

          let level = nodeConfig.directorLevel == 1 ? '' : '第' + nodeConfig.directorLevel + '级主管'
          if (nodeConfig.examineMode == 1) {
            return level
          } else if (nodeConfig.examineMode == 2) {
            return level + "会签"
          }
        } else if (nodeConfig.settype == 4) {
          if (nodeConfig.selectRange == 1) {
            return "发起人自选"
          } else {
            if (nodeConfig.nodeUserList.length > 0) {
              if (nodeConfig.selectRange == 2) {
                return "发起人自选"
              } else {
                return '发起人从' + nodeConfig.nodeUserList[0].name + '中自选'
              }
            } else {
              return "";
            }
          }
        } else if (nodeConfig.settype == 5) {
          return "发起人自己"
        } else if (nodeConfig.settype == 7) {
          return '从直接主管到通讯录中级别最高的第' + nodeConfig.examineEndDirectorLevel + '个层级主管'
        }
      },
      saveApprover() {
        this.approverConfig.error = !this.setApproverStr(this.approverConfig)
        this.$emit("update:nodeConfig", this.approverConfig);
        this.approverDrawer = false;
      },
      addPromoter() {
        this.promoterVisible = true;
        this.getDepartmentList();
        this.promoterSearchName = "";
        this.checkedEmployessList = [];
        this.checkedDepartmentList = [];
        for (var i = 0; i < this.flowPermission1.length; i++) {
          var {type, name, targetId} = this.flowPermission1[i];
          if (type == 1) {
            this.checkedEmployessList.push({
              employeeName: name,
              id: targetId
            });
          } else if (type == 3) {
            this.checkedDepartmentList.push({
              departmentName: name,
              id: targetId
            });
          }
        }
      },
      arrToStr(arr) {
        if (arr) {
          return arr.map(item => {
            return item.name
          }).toString()
        }
      },
      toggleStrClass(item, key) {
        let a = item.zdy1 ? item.zdy1.split(",") : []
        return a.some(item => {
          return item == key
        });
      },
      toStrChecked(item, key) {
        let a = item.zdy1 ? item.zdy1.split(",") : []
        var isIncludes = this.toggleStrClass(item, key);
        if (!isIncludes) {
          a.push(key)
          item.zdy1 = a.toString()
        } else {
          this.removeStrEle(item, key);
        }
      },
      removeStrEle(item, key) {
        let a = item.zdy1 ? item.zdy1.split(",") : []
        var includesIndex;
        a.map((item, index) => {
          if (item == key) {
            includesIndex = index
          }
        });
        a.splice(includesIndex, 1);
        item.zdy1 = a.toString()
      },
      toggleClass(arr, elem, key = 'id') {
        return arr.some(item => {
          return item[key] == elem[key]
        });
      },
      toChecked(arr, elem, key = 'id') {
        var isIncludes = this.toggleClass(arr, elem, key);
        !isIncludes ? arr.push(elem) : this.removeEle(arr, elem, key);
      },
      removeEle(arr, elem, key = 'id') {
        var includesIndex;
        arr.map((item, index) => {
          if (item[key] == elem[key]) {
            includesIndex = index
          }
        });
        arr.splice(includesIndex, 1);
      },
      getRoleList() {
        this.$axios.get(`${process.env.BASE_URL}roles.json`).then(res => {
          this.roles = res.data.list;
        })
      },
      getDepartmentList(parentId = 0) {
        this.$axios.get(`${process.env.BASE_URL}departments.json?parentId=${parentId}`).then(res => {
          this.departments = res.data;
        })
      },
      delNode() {
        this.$emit("update:nodeConfig", this.nodeConfig.childNode);
      },
      addTerm() {
        this.operateConditionVarList();
        let len = this.nodeConfig.conditionNodes.length + 1
        this.nodeConfig.conditionNodes.push({
          "nodeName": "条件" + len,
          "id": "sid-" + guid(),
          "type": 3,
          "priorityLevel": len,
          "conditionList": [],
          "nodeUserList": [],
          "childNode": null
        });
        for (var i = 0; i < this.nodeConfig.conditionNodes.length; i++) {
          this.nodeConfig.conditionNodes[i].error = this.conditionStr(this.nodeConfig.conditionNodes[i], i) == "请设置条件" && i != this.nodeConfig.conditionNodes.length - 1
        }
        this.$emit("update:nodeConfig", this.nodeConfig);
      },
      delTerm(index) {
        this.nodeConfig.conditionNodes.splice(index, 1)
        for (var i = 0; i < this.nodeConfig.conditionNodes.length; i++) {
          this.nodeConfig.conditionNodes[i].error = this.conditionStr(this.nodeConfig.conditionNodes[i], i) == "请设置条件" && i != this.nodeConfig.conditionNodes.length - 1
        }
        this.$emit("update:nodeConfig", this.nodeConfig);
        if (this.nodeConfig.conditionNodes.length == 1) {
          if (this.nodeConfig.childNode) {
            if (this.nodeConfig.conditionNodes[0].childNode) {
              this.reData(this.nodeConfig.conditionNodes[0].childNode, this.nodeConfig.childNode)
            } else {
              this.nodeConfig.conditionNodes[0].childNode = this.nodeConfig.childNode
            }
          }
          this.$emit("update:nodeConfig", this.nodeConfig.conditionNodes[0].childNode);
        }
      },
      reData(data, addData) {
        if (!data.childNode) {
          data.childNode = addData
        } else {
          this.reData(data.childNode, addData)
        }
      },
      setPerson(priorityLevel) {
        var {type} = this.nodeConfig;
        if (type == 0) {
          this.getBtnList('0');
          this.getAllBus();
          this.approverConfig = JSON.parse(JSON.stringify(this.nodeConfig))
          this.userForm.operate = '3'
          this.startApproverDrawer = true;
        } else if (type == 1) {
          this.userForm.operate = '1'

          this.init();
          this.getBtnList('1');
          this.getAllBus();
          this.approverDrawer = true;
          this.approverConfig = JSON.parse(JSON.stringify(this.nodeConfig))
          this.approverConfig.settype = this.approverConfig.settype ? this.approverConfig.settype : 1


        } else if (type == 2) {
          this.userForm.title = this.approverConfig.nodeName;
          this.getAllBus();
          this.getBtnList();
          this.copyerDrawer = true;
          this.copyerConfig = JSON.parse(JSON.stringify(this.nodeConfig))
          this.ccSelfSelectFlag = this.copyerConfig.ccSelfSelectFlag == 0 ? [] : [this.copyerConfig.ccSelfSelectFlag]
        } else {
          this.conditionDrawer = true
          this.bPriorityLevel = priorityLevel;
          this.conditionsConfig = JSON.parse(JSON.stringify(this.nodeConfig))
          this.conditionConfig = this.conditionsConfig.conditionNodes[priorityLevel - 1]
          this.conditionForm = this.conditionConfig.conditionList

        }
      },
      arrTransfer(index, type = 1) {//向左-1,向右1
        this.nodeConfig.conditionNodes[index] = this.nodeConfig.conditionNodes.splice(index + type, 1, this.nodeConfig.conditionNodes[index])[0];
        this.nodeConfig.conditionNodes.map((item, index) => {
          item.priorityLevel = index + 1
        })
        for (var i = 0; i < this.nodeConfig.conditionNodes.length; i++) {
          this.nodeConfig.conditionNodes[i].error = this.conditionStr(this.nodeConfig.conditionNodes[i], i) == "请设置条件" && i != this.nodeConfig.conditionNodes.length - 1
        }
        this.$emit("update:nodeConfig", this.nodeConfig);
      }
    }
  }
</script>
<style>
  .a_ .el-drawer.rtl {
    overflow-y: scroll;
  }
</style>
<style scoped>
  .person_tree img {
    width: 14px !important;
    height: 14px !important;
    vertical-align: middle !important;
    margin-right: 5px !important;
  }

  .has_selected img {
    width: 14px !important;
    height: 14px !important;
  }

  .error_tip {
    position: absolute;
    top: 0px;
    right: 0px;
    transform: translate(150%, 0px);
    font-size: 24px;
  }

  .add-node-popover-body {
    display: flex;
  }

  .promoter_content {
    padding: 0 20px;
  }

  .condition_content .el-button,
  .copyer_content .el-button,
  .approver_self_select .el-button,
  .promoter_content .el-button,
  .approver_content .el-button {
    margin-bottom: 20px;
  }

  .promoter_content p {
    padding: 18px 0;
    font-size: 14px;
    line-height: 20px;
    color: #000000;
  }

  .promoter_person .el-dialog__body {
    padding: 10px 20px 14px 20px;
  }

  .person_body {
    border: 1px solid #f5f5f5;
    height: 500px;
  }

  .person_tree {
    padding: 10px 12px 0 8px;
    width: 280px;
    height: 100%;
    border-right: 1px solid #f5f5f5;
  }

  .person_tree input {
    padding-left: 22px;
    width: 210px;
    height: 30px;
    font-size: 12px;
    border-radius: 2px;
    border: 1px solid #d5dadf;
    background: url(~@/assets/images/list_search.png) no-repeat 10px center;
    background-size: 14px 14px;
    margin-bottom: 14px;
  }

  .tree_nav span {
    display: inline-block;
    padding-right: 10px;
    margin-right: 5px;
    max-width: 6em;
    color: #38adff;
    font-size: 12px;
    cursor: pointer;
    background: url(~@/assets/images/jiaojiao.png) no-repeat right center;
  }

  .tree_nav span:last-of-type {
    background: none;
  }

  .person_tree ul,
  .has_selected ul {
    height: 420px;
    overflow-y: auto;
  }

  .person_tree li {
    padding: 5px 0;
  }

  .person_tree li i {
    float: right;
    padding-left: 24px;
    padding-right: 10px;
    color: #3195f8;
    font-size: 12px;
    cursor: pointer;
    background: url(~@/assets/images/next_level_active.png) no-repeat 10px center;
    border-left: 1px solid rgb(238, 238, 238);
  }

  .person_tree li a.active + i {
    color: rgb(197, 197, 197);
    background-image: url(~@/assets/images/next_level.png);
    pointer-events: none;
  }

  .person_tree img {
    width: 14px;
    vertical-align: middle;
    margin-right: 5px;
  }

  .has_selected {
    width: 276px;
    height: 100%;
    font-size: 12px;
  }

  .has_selected ul {
    height: 460px;
  }

  .has_selected p {
    padding-left: 19px;
    padding-right: 20px;
    line-height: 37px;
    border-bottom: 1px solid #f2f2f2;
  }

  .has_selected p a {
    float: right;
  }

  .has_selected ul li {
    margin: 11px 26px 13px 19px;
    line-height: 17px;
  }

  .has_selected li span {
    vertical-align: middle;
  }

  .has_selected li img:first-of-type {
    width: 14px;
    vertical-align: middle;
    margin-right: 5px;
  }

  .has_selected li img:last-of-type {
    float: right;
    margin-top: 2px;
    width: 14px;
  }

  el-radio-group {
    padding: 20px 0;
  }

  .approver_content {
    padding-bottom: 10px;
    border-bottom: 1px solid #f2f2f2;
  }

  .approver_content .el-radio,
  .approver_some .el-radio,
  .approver_self_select .el-radio {
    width: 27%;
    margin-bottom: 20px;
  }

  .copyer_content .el-checkbox {
    margin-bottom: 20px;
  }

  .el-checkbox__label {
    font-size: 12px;
  }

  .condition_content,
  .copyer_content,
  .approver_self_select,
  .approver_manager,
  .approver_content,
  .approver_some {
    padding: 20px 20px 0;
  }

  .approver_manager p:first-of-type,
  .approver_some p {
    line-height: 19px;
    font-size: 14px;
    margin-bottom: 14px;
  }

  .approver_manager p {
    line-height: 32px;
  }

  .approver_manager select {
    width: 420px;
    height: 32px;
    background: rgba(255, 255, 255, 1);
    border-radius: 4px;
    border: 1px solid rgba(217, 217, 217, 1);
  }

  .approver_manager p.tip {
    margin: 10px 0 22px 0;
    font-size: 12px;
    line-height: 16px;
    color: #f8642d;
  }

  .approver_self {
    padding: 28px 20px;
  }

  .selected_list {
    margin-bottom: 20px;
    line-height: 30px;
  }

  .selected_list span {
    margin-right: 10px;
    padding: 3px 6px 3px 9px;
    line-height: 12px;
    white-space: nowrap;
    border-radius: 2px;
    border: 1px solid rgba(220, 220, 220, 1);
  }

  .selected_list img {
    margin-left: 5px;
    width: 7px;
    height: 7px;
    cursor: pointer;
  }

  .approver_self_select h3 {
    margin: 5px 0 20px;
    font-size: 14px;
    font-weight: bold;
    line-height: 19px;
  }

  .condition_copyer .el-drawer__body .priority_level {
    position: absolute;
    top: 11px;
    right: 30px;
    width: 100px;
    height: 32px;
    background: rgba(255, 255, 255, 1);
    border-radius: 4px;
    border: 1px solid rgba(217, 217, 217, 1);
  }

  .condition_content p.tip {
    margin: 20px 0;
    width: 510px;
    text-indent: 17px;
    line-height: 45px;
    background: rgba(241, 249, 255, 1);
    border: 1px solid rgba(64, 163, 247, 1);
    color: #46a6fe;
    font-size: 14px;
  }

  .condition_content ul {
    max-height: 500px;
    overflow-y: scroll;
    margin-bottom: 20px;
  }

  .condition_content li > span {
    float: left;
    margin-right: 8px;
    width: 70px;
    line-height: 32px;
    text-align: right;
  }

  .condition_content li > div {
    display: inline-block;
    width: 370px;
  }

  .condition_content li:not(:last-child) > div > p {
    margin-bottom: 20px;
  }

  .condition_content li > div > p:not(:last-child) {
    margin-bottom: 10px;
  }

  .condition_content li > a {
    float: right;
    margin-right: 10px;
    margin-top: 7px;
  }

  .condition_content li select,
  .condition_content li input {
    width: 100%;
    height: 32px;
    background: rgba(255, 255, 255, 1);
    border-radius: 4px;
    border: 1px solid rgba(217, 217, 217, 1);
  }

  .condition_content li select + input {
    width: 260px;
  }

  .condition_content li select {
    margin-right: 10px;
    width: 100px;
  }

  .condition_content li p.selected_list {
    padding-left: 10px;
    border-radius: 4px;
    min-height: 32px;
    border: 1px solid rgba(217, 217, 217, 1);
  }

  .condition_content li p.check_box {
    line-height: 32px;
  }

  .condition_list .el-dialog__body {
    padding: 16px 26px;
  }

  .condition_list p {
    color: #666666;
    margin-bottom: 10px;
  }

  .condition_list p.check_box {
    margin-bottom: 0;
    line-height: 36px;
  }

  .demo-drawer-footer {
    width: 30%;
    position: fixed;
    bottom: 0;
    right: 0;
    border-top: 1px solid #e8e8e8;
    padding: 10px 16px;
    text-align: right;
    background: #fff;
  }

  .el-drawer__header > :first-child {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 18px;
    font-weight: 600;
    color: #171e31;
  }
</style>
